<!--
	面包屑组件
	<breadcrumb :list="navList"></breadcrumb>
	//数据例子
				navList:[{
					name:'基础数据表格',
					type:false,
					url:'/demo/table'
				},{
					name:'新增基础表单页',
					type:true,
					url:''
				}]
-->
<template>
	<div class="breadcrumb">
		<el-breadcrumb separator="/">
			<el-breadcrumb-item>当前位置</el-breadcrumb-item>
			<!-- :to="{ path: '/' }"-->
			<el-breadcrumb-item>{{$store.state.navName!=''?$store.state.navName:'首页'}}</el-breadcrumb-item>
			<el-breadcrumb-item v-for="(item,index) in breadcrumbList" :key="index" :to="{ path: item.url }">
				<span v-if="item.type" class="textMain">{{item.name}}</span>
				<span v-else>{{item.name}}</span>
			</el-breadcrumb-item>
		</el-breadcrumb>
	</div>
</template>

<script>
	
	export default {
		data() {
			return {
				navData:[],
				breadcrumbList:[]
			}
		},
		props: {
			// ID
			id: {
				type: String,
				default: ''
			},
			list:{
				type: Array,
				default: []
			}
		},mounted(){
			this.breadcrumbList=this.list
			// this.navData=JSON.parse(localStorage.getItem("navList"))
			// console.log(this.navData)
			// this.getBreadcrumb()
		},
		methods: {
			// getBreadcrumb(){
			// 	let that=this
			// 	that.navData.map((item,index)=>{
					
			// 		if(item.id==that.id){
			// 			that.breadcrumbList=[{
			// 			   name:item.name,
			// 			   type:true,
			// 			   url:item.url
			// 			}]
			// 		}else{
			// 			item.navList.map((item0,index0)=>{
			// 				console.log(item0+'------'+that.id)
			// 				if(item0.id==that.id){
			// 					that.breadcrumbList=[{
			// 						name:item.name,
			// 						type:false,
			// 						url:item.url
			// 					},{
			// 						name:item0.name,
			// 						type:true,
			// 						url:item0.url
			// 					}]
			// 				}
			// 			})
			// 		}
					
			// 	})
			// }
		}
	}
</script>

<style>
.breadcrumb{
	margin-bottom: 10px;
}
/* /deep/ .el-breadcrumb {
    height: 1.5rem;
    line-height: 1.5rem;
} */
</style>
